<template>
  <div>
    御剑乘风来,除魔天地间!===uncle{{ count }}==={{ $store.getters.total }}
    <!--  <button @click="$store.commit('add')">加</button>
    <button @click="$store.commit('reduce')">减</button> -->
    <button @click="add()">加</button>
    <button @click="reduce()">减</button>
    <button @click="rename('雪虎')">改名</button>
    <button @click="addAsync1()">异步加</button>
    {{ total }}
  </div>
</template>
<script>
import { mapMutations } from "vuex";
import { mapActions } from "vuex";
import { mapGetters } from "vuex";
export default {
  name: "",
  data() {
    return {};
  },
  created() {},
  computed: {
    count() {
      return this.$store.state.count;
    },
    ...mapGetters(["total"]),
  },
  methods: {
    ...mapActions(["addAsync"]),
    ...mapMutations(["add", "reduce", "rename"]),
    addAsync1() {
      // this.$store.dispatch('addAsync',10)
      this.addAsync(10);
    },
  },
};
</script>
<style lang='less'  scoped>
</style>
